/**
 * Created with PyCharm.
 * User: mojtaba
 * Date: 8/24/13
 * Time: 5:40 PM
 * To change this template use File | Settings | File Templates.
 */
var Width = "30px";
//var WidthOnHover = "60px";
var rightMargin = "50px";
var leftMargin = "50px";

var searchBoxWidth = "500px";
var searchBoxWidthFocus = "600px";

$(document).ready(function(){
    // hover the login/register button in the homepage from 0.7 to 1.0
    $(".navigation").hover(function(){
        $(this).animate({
            "opacity" : "0.7"

        }, "fast");
    },function(){
        $(this).animate({
            "opacity" : "1"
        }, "fast");


    // also by click the login/register button register and login form must be shown ....
    }).on("click", function(){
        //everything fade except .forms
        $('body > :not(.forms)').animate({
            opacity : "0.2"
        }, "slow");
        //then forms will be shown after fading other elements
        $('.forms').show();
    });



    //by clicking the "X" button on the forms everything come back to the default home page
    $("#close").on("click", function(){
        $('.forms').hide();
        $('body > :not(.forms)').animate({
            opacity : "1"
        }, "slow");
    });

    $("#register input").focus(function(){
        $(this).closest("form").addClass("formSelected");
        $(this).animate({
            opacity:1.0,
            marginBottom:"50px"
        }, "fast");
        $(this).next().show("slow");
        $(this).css("background" , "rgba(255, 245, 0, 0.9)");
    }).focusout(function(){
        $(this).closest("form").removeClass("formSelected");
        $(this).animate({
            opacity:0.8,
            marginBottom:"0"
        }, "fast");
        $(this).next().hide("slow");
        $(this).css("background" , "rgba(255, 255, 255, 1)");
    });


    $("#login input").focus(function(){
        $(this).closest("form").addClass("formSelected");
        $(this).animate({
            opacity:1.0

        }, "fast");
        $(this).css("background" , "rgba(255, 245, 0, 0.9)");
    }).focusout(function(){
        $(this).closest("form").removeClass("formSelected");
        $(this).animate({
            opacity:0.8
        }, "fast");
        $(this).css("background" , "rgba(255, 255, 255, 1)");
    });

    //login ALERT when email or password is not correct !!
    $(".loginAlert").delay(5000).fadeOut("slow");


    $("#register").submit(function(event){
        $(".bubblingG").show();
        event.preventDefault();
        var firstName = $("input[name='firstname']").val();
        var lastName = $("input[name='lastname']").val();
        var emailAddress = $("input[name='email']").val();
        var password = $("input[name='password']").val();
        var data ={
            firstName:firstName,
            lastName:lastName,
            emailAddress:emailAddress,
            password:password
        }
        $.ajax({
            url: 'ajax/',
            data: data,
            dataType: 'json',
            success:function(result){
                var isOK=0;
                if(result.fn=='0'){
                    isOK +=1 ;
                    var warningSection = $("#registerFirstName").next();
                    warningSection.show("slow");
                    warningSection.prev().animate({
                        opacity:1.0,
                        marginBottom:"50px"
                    }, "fast");
                    warningSection.css("background" ,"#da1f1f");

                }else{
                    var warningSection = $("#registerFirstName").next();
                    warningSection.css("background" ,"green");
                }
                if(result.ln=='0'){
                    isOK +=1;
                    var warningSection = $("#registerLastName").next();
                    warningSection.show("slow");
                    warningSection.prev().animate({
                        opacity:1.0,
                        marginBottom:"50px"
                    }, "fast");
                    warningSection.css("background" ,"#da1f1f");

                }else{
                    var warningSection = $("#registerLastName").next();
                    warningSection.css("background" ,"green");
                }
                if(result.email=='0'){
                    isOK +=1;
                    var warningSection = $("#registerEmail").next();
                    warningSection.text("enter a valid address Email");
                    warningSection.show("slow");
                    warningSection.prev().animate({
                        opacity:1.0,
                        marginBottom:"50px"
                    }, "fast");
                    warningSection.css("background" ,"#da1f1f");

                }else{
                    if(result.email==1){
                        var warningSection = $("#registerEmail").next();
                        warningSection.text("enter a valid address Email");
                        warningSection.css("background" ,"green");
                    }else{
                        isOK +=1;
                        var warningSection = $("#registerEmail").next();
                        warningSection.text("This Email is Registered try another please");
                        warningSection.show("slow");
                        warningSection.prev().animate({
                        opacity:1.0,
                        marginBottom:"50px"
                    }, "fast");
                    warningSection.css("background" ,"#da1f1f");
                    }
                }
                if(result.pass=='0'){
                    isOK +=1;
                    var warningSection = $("#registerPassword").next();
                    warningSection.show("slow");
                    warningSection.prev().animate({
                        opacity:1.0,
                        marginBottom:"50px"
                    }, "fast");

                    warningSection.css("background" ,"#da1f1f");

                }else{
                    var warningSection = $("#registerPassword").next();
                    warningSection.css("background" ,"green");
                }

                $(".bubblingG").hide();
                if(isOK==0){
                    gotoHome();
                }
            }
        });


    });
    function gotoHome(){
        document.register.submit();
    }


    /* ///////////////////PROFILE//////////////////// */

    //TOP section of the profile

    $("#top").on("click", function(){
        $(this).animate({marginTop : "90px"}, "slow");
        $("#topContainer").show("slow");

    }).hover(function(){
        var image = $("#topImage");
        image.fadeOut('fast', function () {
            image.attr('src', '../../static/social/images/downHover.png');
            image.fadeIn('fast');
        });
    },function(){
            var image = $("#topImage");
            image.fadeOut('fast', function () {
                image.attr('src', '../../static/social/images/down.png');
                image.fadeIn('fast');
        });
    });
    $("#mainTop").mouseleave( function(){
        $("#topContainer").hide("slow");
        $("#top").animate({marginTop : "0"}, "slow");
    });

    $("#exitImage").hover(function(){
        $("#exit").css("background" , "rgba(213, 165, 255, 0.35)");
    },function(){
        $("#exit").css("background" , "rgba(213, 165, 255, 0)");
    });

    $("#homeImage").hover(function(){
        $("#home").css("background" , "rgba(255, 122, 0, 0.35)");
    },function(){
        $("#home").css("background" ,"rgba(213, 165, 255, 0)");
    });

    $("#chatImage").hover(function(){
        $("#chat").css("background" , "rgba(243, 165, 205, 0.35)");
    },function(){
        $("#chat").css("background" ,"rgba(213, 165, 255, 0)");
    });

    $("#notificationImage").hover(function(){
        $("#notification").css("background" , "rgba(216, 81, 81, 0.35)");
    },function(){
        $("#notification").css("background" ,"rgba(213, 165, 255, 0)");
    });


    //BOTTOM section of the profile

    $("#bottom").on("click", function(){
        $(this).animate({
            marginBottom : "70px"
        }, "slow");
        $("#bottomContainer").show("slow");

    //BOTTOM section arrow image change color on hover[in] and hover[out]

    }).hover(function(){
        var image = $("#bottomImage");
        image.fadeOut('fast', function () {
            image.attr('src', '../../static/social/images/upHover.png');
            image.fadeIn('fast');
        });
    },function(){
            var image = $("#bottomImage");
            image.fadeOut('fast', function () {
                image.attr('src', '../../static/social/images/up.png');
                image.fadeIn('fast');
        });
    });
    $("#mainBottom").mouseleave( function(){
        $("#bottom").animate({marginBottom : "0"}, "slow");
        $("#bottomContainer").hide("slow");
    });

    //RIGHT section of the profile

    $("#right").on("click", function(){
        $(this).animate({
            marginRight : "83px" //rightMargin
        },"slow");
        $("#rightContainer").show("slow");

    //Right section arrow image change color on hover[in] and hover[out]

    }).hover(function(){
        var image = $("#rightImage");
        image.fadeOut('fast', function () {
            image.attr('src', '../../static/social/images/leftHover.png');
            image.fadeIn('fast');
        });
    },function(){
            var image = $("#rightImage");
            image.fadeOut('fast', function () {
                image.attr('src', '../../static/social/images/left.png');
                image.fadeIn('fast');
        });
    });

    //Right Section on mouse leave the content

    $("#mainRight").mouseleave( function(){
        $("#right").animate({marginRight : "0"},"slow");
        $("#rightContainer").hide("slow");
    });


    //Left section of the profile

    $("#left").on("click", function(){
        $(this).animate({
            marginLeft : "70px" //leftMargin
        },"slow");
        $("#leftContainer").show("slow");

    //Left section arrow image change color on hover[in] and hover[out]

    }).hover(function(){
        var image = $("#leftImage");
        image.fadeOut('fast', function () {
            image.attr('src', '../../static/social/images/rightHover.png');
            image.fadeIn('fast');
        });
    },function(){
            var image = $("#leftImage");
            image.fadeOut('fast', function () {
                image.attr('src', '../../static/social/images/right.png');
                image.fadeIn('fast');
        });
    });

    //Left Section on mouse leave the content

    $("#mainLeft").mouseleave( function(){
        $("#left").animate({marginLeft : "0"},"slow");
        $("#leftContainer").hide("slow");
    });


    $("#search").focus(function(){
        $(this).animate({
            width:searchBoxWidthFocus
        },"slow");
    }).focusout(function(){
        $(this).animate({
            width:searchBoxWidth
        },"slow")
    });

    //welcome message

    $(".alert").animate({
        "right":"50px"
    } , 1500).delay(1000).fadeOut(1000);

    $("#right img,#left img").css("margin-top",getDocHeight()/2-40);
});

function getDocHeight() {
    var D = document;
    return Math.max(
        D.body.scrollHeight, D.documentElement.scrollHeight,
        D.body.offsetHeight, D.documentElement.offsetHeight,
        D.body.clientHeight, D.documentElement.clientHeight
    );
}